<template>
    <div class="add-equipment">
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>单位名称</label>
            </div>
            <div>
                <p>{{detailData.ParentName}}</p>
            </div>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>项目名称</label>
            </div>
            <div>
                <p>{{detailData.ProjectName}}</p>
            </div>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>设备类型</label>
            </div>
            <div>
                <label>设备类型</label>
            </div>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>自编号</label>
            </div>
            <div>
                <p>{{detailData.EquipmentNo}}</p>
            </div>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>设备型号</label>
            </div>
            <div>
                <p>{{detailData.EquipmentModeNo}}</p>
            </div>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>设备编号</label>
            </div>
            <div>
                <p>{{detailData.EquipmentRecordNo}}</p>
            </div>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>安装位置</label>
            </div>
            <div>
                <p>{{detailData.SetupLocation}}</p>
            </div>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>是否自有设备</label>
            </div>
            <div>
                <p>{{detailData.IsSelfEquipment}}</p>
            </div>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>进场日期</label>
            </div>
            <div>
                <p>{{detailData.EntryDate}}</p>
            </div>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>安装日期</label>
            </div>
            <div>
                <p>{{detailData.SetupDate}}</p>
            </div>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>旁站日期</label>
            </div>
            <div>
                <p>{{detailData.StationDate}}</p>
            </div>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>拆除日期</label>
            </div>
            <div>
                <p>{{detailData.DismantleDate}}</p>
            </div>
        </div>
        <div class="form-item form-item-style2">
            <div class="label-title">
                <label>旁站人员</label>
            </div>
            <div>
                <p class="textarea">{{detailData.StationPerSonnel}}</p>
            </div>
        </div>
        <div class="cut-off-rule"></div>
        <div class="form-section">
            <h3 data-v-d3024438="">拆除过程监控</h3>
            <div class="form-item form-item-style1">
                <div class="label-title label-title1">
                    <label>拆除方案是否交底</label>
                </div>
                <div class="select-section">
                    <div :class='{"active":detailData.IsDisclose == 1}'>
                        是
                    </div>
                    <div :class='{"active":detailData.IsDisclose != 1}'>
                        否
                    </div>
                </div>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title label-title1">
                    <label>拆除人员证件是否齐全</label>
                </div>
                <div class="select-section">
                    <div :class='{"active":detailData.IsCertificateValid == 1}'>
                        是
                    </div>
                    <div :class='{"active":detailData.IsCertificateValid != 1}'>
                        否
                    </div>
                </div>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title label-title1">
                    <label>是否按方案进行拆除作业</label>
                </div>
                <div class="select-section">
                    <div :class='{"active":detailData.IsDismantlingScheme == 1}'>
                        是
                    </div>
                    <div :class='{"active":detailData.IsDismantlingScheme != 1}'>
                        否
                    </div>
                </div>
            </div>
            <div class="form-item form-item-style2">
                <div class="label-title">
                    <label>旁站记录</label>
                </div>
                <div>
                    <p class="textarea">{{detailData.StationRecord}}</p>
                </div>
            </div>
        </div>
        <myMenu></myMenu>
    </div>
</template>
<script>
import upload from '@/commonComponents/upload/index'
import myMenu from '@/commonComponents/menu'
export default {
    name: 'equipmentSide',
    data () {
        return {
            accopt: [['项目部一', '项目部2']], // 验收结果
            accoptVal: ['项目部一'],
            startTime: '',
            endTime: '',
            YSFormData: '',
            YSuploadLength: '',
            userInfo: '',
            detailData: ''
        }
    },
    components: {
        upload,
        myMenu
    },
    created () {
        this.userInfo = JSON.parse(localStorage.getItem('userInfo')) || {}
        this.getDetail()
    },
    methods: {
        getDetail () {
            this.$vux.loading.show({
                text: '加载中...'
            })
            let params = {
                'allowPaging': true,
                'business': 'getDismantlingStationDetails',
                'data': {
                    id: this.$route.query.id
                },
                'pageIndex': 0,
                'pageSize': 20,
                'tokenId': '',
                'userId': this.userInfo.userid
            }
            this.$axiosAjax.getConfigJson(params).then((res) => {
                if (res.data.code === 0) {
                    this.detailData = res.data.data
                }
            }).catch(() => {

            }).finally(() => {
                this.$vux.loading.hide()
            })
        }
    }
}
</script>
<style lang="less" scoped>
.select-section {
    display: flex;
}
.select-section div {
    padding-left: 26px;
    background: url(../../../../static/images/select.png) no-repeat left center;
    background-size: 17px 17px;
}
.select-section div:first-child {
    margin-right: 10px;
}
.select-section .active {
    background: url(../../../../static/images/selected.png) no-repeat left
        center;
    background-size: 17px 17px;
}
.add-equipment .label-title1 {
    width: 168px;
    line-height: 18px;
}
.form-section {
    ul {
        padding-left: 20px;
        li {
            border-bottom: 1px solid #efeff4;
        }
    }
    .list1 {
        li {
            a {
                display: flex;
                justify-content: space-between;
                padding: 10px 0;
                p {
                    line-height: 18px;
                    font-size: 14px;
                    color: #666;
                }
                .right-section {
                    padding-right: 20px;
                }
            }
            &:last-child {
                border-bottom: none;
            }
        }
    }
    .list2 {
        li {
            padding-right: 20px;
            a {
                display: flex;
                justify-content: space-between;
                align-items: center;
                height: 55px;
            }
            p {
                color: #666;
                font-size: 14px;
            }
        }
    }
}
.right-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    span {
        font-size: 14px;
        color: #666;
    }
}
.icon-right {
    fill: #999;
}
</style>
